
/* =====================================================
   INDIA TOUR PACKAGES SECTION  (prefix: ip-)
   Theme: #FFBE00 (yellow) + #010021 (dark blue)
   ADD THIS BLOCK AT THE END OF YOUR EXISTING CSS FILE
   ===================================================== */
.ip-section{
  --ip-yellow:#FFBE00;
  --ip-yellow-soft:#FFF5D6;
  --ip-navy:#010021;
  --ip-navy-2:#14124a;
  --ip-line:#e8e6f0;
  padding:60px 15px;
  background:#f7f8fc;
  font-family:inherit;
}
.ip-section *{box-sizing:border-box}
.ip-wrap{max-width:1200px;margin:0 auto}

/* Heading */
.ip-head{text-align:center;max-width:860px;margin:0 auto 38px}
.ip-section .ip-head h1,.ip-section .ip-head h2{
  display:inline-block;background:linear-gradient(135deg,var(--ip-navy),var(--ip-navy-2));
  color:var(--ip-yellow);font-size:30px;font-weight:800;line-height:1.35;
  padding:18px 30px;margin:0;border-radius:14px;border-bottom:4px solid var(--ip-yellow);
  box-shadow:0 10px 26px rgba(1,0,33,.25);text-align:center}
.ip-section .ip-head .ip-line{width:70px;height:4px;background:var(--ip-yellow);border-radius:4px;margin:16px auto 0}

/* Grid: 3 desktop / 2 tablet / 1 mobile */
.ip-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}

/* Card */
.ip-card{background:#fff;border-radius:18px;overflow:hidden;display:flex;flex-direction:column;
  border:1px solid var(--ip-line);border-bottom:4px solid var(--ip-yellow);
  box-shadow:0 8px 26px rgba(1,0,33,.10);transition:transform .3s,box-shadow .3s}
.ip-card:hover{transform:translateY(-6px);box-shadow:0 16px 38px rgba(1,0,33,.18)}

/* Image with dark-blue overlay + badge */
.ip-imgbox{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:#e9e9f2}
.ip-imgbox img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s}
.ip-card:hover .ip-imgbox img{transform:scale(1.08)}
.ip-imgbox:after{content:"";position:absolute;left:0;right:0;bottom:0;height:45%;
  background:linear-gradient(to top,rgba(1,0,33,.42),rgba(1,0,33,0));pointer-events:none}
.ip-badge{position:absolute;top:14px;left:0;z-index:2;background:var(--ip-yellow);color:var(--ip-navy);
  font-size:12px;font-weight:800;line-height:1;padding:8px 14px 8px 12px;
  border-radius:0 30px 30px 0;box-shadow:0 4px 10px rgba(1,0,33,.3)}

/* Body */
.ip-body{padding:20px 22px 24px;display:flex;flex-direction:column;flex:1}
.ip-body h2,.ip-body h3{font-size:20px;font-weight:800;line-height:1.35;margin:0 0 14px;padding:0}
.ip-body h2 a,.ip-body h3 a{color:var(--ip-navy);text-decoration:none}
.ip-body h2 a:hover,.ip-body h3 a:hover{color:#9a6b00}

/* Facility icons strip */
.ip-icons{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 20px;padding:0}
.ip-icons i{width:32px;height:32px;border-radius:50%;background:var(--ip-navy);color:var(--ip-yellow);
  display:flex;align-items:center;justify-content:center;font-size:14px;line-height:1}

/* Duration / code / package line (Uttarakhand-style cards) */
.ip-meta{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;padding:0}
.ip-meta span{background:var(--ip-yellow-soft);color:var(--ip-navy);border-left:3px solid var(--ip-yellow);
  font-size:13px;font-weight:600;line-height:1.3;padding:6px 10px;border-radius:4px}
.ip-meta b{font-weight:800}

/* Buttons */
.ip-btns{display:flex;gap:10px;margin-top:auto}
.ip-btn{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;
  font-size:14px;font-weight:700;padding:12px 8px;border-radius:50px;text-decoration:none;
  border:2px solid transparent;transition:background .2s,color .2s,border-color .2s}
.ip-explore{background:var(--ip-yellow);color:var(--ip-navy);border-color:var(--ip-yellow)}
.ip-explore:hover{background:var(--ip-navy);color:var(--ip-yellow);border-color:var(--ip-navy)}
.ip-enq{background:var(--ip-navy);color:var(--ip-yellow);border-color:var(--ip-navy)}
.ip-enq:hover{background:#fff;color:var(--ip-navy);border-color:var(--ip-yellow)}
.ip-btn:focus-visible,.ip-body h2 a:focus-visible,.ip-body h3 a:focus-visible{outline:3px solid var(--ip-navy);outline-offset:2px}

@media(max-width:991px){
  .ip-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
  .ip-section .ip-head h1,.ip-section .ip-head h2{font-size:25px}
}
@media(max-width:600px){
  .ip-section{padding:42px 12px}
  .ip-grid{grid-template-columns:1fr;gap:20px}
  .ip-section .ip-head h1,.ip-section .ip-head h2{font-size:21px;padding:14px 18px}
}
@media(prefers-reduced-motion:reduce){
  .ip-card,.ip-imgbox img{transition:none}
  .ip-card:hover{transform:none}
}
